.header {
  max-width: 880px;
  width: calc(100% * 880/1280);
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid rgba(84, 84, 84, .7);
}

@media screen and (max-width: 1080px) {
  .header {
    width: 90%;
  }
}

@media screen and (max-width: 640px) {
  .header {
    padding: 0;
    display: grid;
    grid-template-columns: 100%;
  }
}




/* .header {
  display: flex;
  margin: 45px auto 40px;
  padding: 0;
  max-width: 880px;
  border-bottom: 1px solid rgba(84, 84, 84, 0.7);
}

@media screen and (max-width: 425px) {
  .header {
    margin: 28px auto;
  }
}

@media screen and (min-width: 426px) and (max-width: 768px) {
  .header {
    width: 95%;
  }
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  .header {
    width: 95%;
    margin: 28px auto 38px;
  }
}

@media screen and (min-width: 1024px) and (max-width: 1279px) {
  .header {
    width: 95%;
  }
} */